<!-- 
    封装配置化表格组件 
    1. 可以支持异步数据合本地数据
    2. 集成分页
    3. 自定义模版
-->

<script lang="jsx">
import { onMounted } from 'vue';

export default {
  name: 'Table',
  props: {
    columns: {
      type: Array,
      required: true,
      default: () => []
    },
    data: {
      type: Array,
      required: true,
      default: () => []
    }
  },
  setup(props, ctx) {
    const { columns, data } = props;

    onMounted(() => {
      console.log(ctx.$attrs);
    });

    return () => (
      <el-table data={data} width="100%" size="small">
        {columns.map(v => {
          return <el-table-column {...v}></el-table-column>;
        })}
      </el-table>
    );
  }
};
</script>
